<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <link rel="shortcut icon" href="/img/favicon.webp">
    <link rel="stylesheet" href="/plugs/bootstrap-4.6.2-dist/css/bootstrap.min.css">
    <link rel="stylesheet" href="/css/bootstrap-expand.css">
    <link rel="stylesheet" href="/plugs/iconfont/iconfont.css">

    <link rel="stylesheet" href="/plugs/bootstrap-switch/bootstrap-switch.css">
    <link rel="stylesheet" href="/plugs/bootstrap-pagination/bootstrap-pagination.css">
    <link rel="stylesheet" href="/plugs/bootstrap-select-1.13.9/dist/css/bootstrap-select.min.css">
    <link rel="stylesheet" href="/plugs/bootstrap-dialog/bootstrap-dialog.css">
    <link rel="stylesheet" href="/plugs/bootstrap-dialog/toastr.min.css">
    <link rel="stylesheet" href="/plugs/bootstrap-dialog/bootstrap-dialog-expand.css">
    <link rel="stylesheet" href="/plugs/bootstrap-submenu-3.0.1/dist/css/bootstrap-submenu.css">
    <link rel="stylesheet" href="/plugs/bootstrap-treetable/bootstrap-treetable.css">

    <!--导航栏样式参考   https://www.fengnayun.com/news/content/106448.html-->
    <style type="text/css">
      .static-tab{
            padding: 1rem;
      }
      .navbar .navbar-nav .nav-link {
          padding: 15px 20px;
      }
      .navbar .dropdown-item{
          padding: 15px 40px;
      }
      .navbar .dropdown-menu{
          background:#f8f9fa;
          padding: 0px;
          margin: 0px;
          z-index: 5000;
        }
        .navbar .dropdown-menu .dropdown-item{
            color: #000;
        }
        .navbar .dropdown-toggle::after {
            margin-left: 0.95em;
        }

        .navbar .dropdown-menu .dropdown-item:hover{
            color:#FFF;
            background:#4b545f;
        }

</style>
    <script type="text/javascript" src="/js/jquery-3.5.1.min.js"></script>
    <script type="text/javascript" src="/js/JSON.js"></script>
    <script type="text/javascript" src="/plugs/date.js"></script>
    <script type="text/javascript" src="/plugs/serializable.js"></script>


    <script type="text/javascript" src="/plugs/bootstrap-4.6.2-dist/poper-1.12.5/popper.min.js"></script>
    <script type="text/javascript" src="/plugs/bootstrap-4.6.2-dist/js/bootstrap.min.js"></script>
    <script type="text/javascript" src="/plugs/bootstrap-switch/bootstrap-switch.min.js"></script>
    <script type="text/javascript" src="/plugs/bootstrap-pagination/bootstrap-pagination.js"></script>
    <script type="text/javascript" src="/plugs/bootstrap-select-1.13.9/dist/js/bootstrap-select.min.js"></script>
    <script type="text/javascript" src="/plugs/bootstrap-select-1.13.9/dist/js/i18n/defaults-zh_CN.min.js"></script>

    <script type="text/javascript" src="/plugs/bootstrap-dialog/bootstrap-dialog.js"></script>
    <script type="text/javascript" src="/plugs/bootstrap-dialog/toastr.min.js"></script>
    <script type="text/javascript" src="/plugs/bootstrap-dialog/bootstrap-dialog-expand.js"></script>

    <script type="text/javascript" src="/js/tree.js"></script>
    <script type="text/javascript" src="/plugs/bootstrap-submenu-3.0.1/dist/js/bootstrap-submenu.min.js"></script>
    <script type="text/javascript" src="/plugs/bootstrap-submenu-3.0.1/dist/js/bootstrap-navbar.js"></script>

    <script type="text/javascript" src="/plugs/bootstrap-treetable/bootstrap-treetable.js"></script>
    <script type="text/javascript" src="/plugs/bootstrap-viewer-master/dist/bootstrap.viewer.js"></script>
</head>
<script type="text/javascript">
    $(function () {
        $.getJSON("/json/navbar/navbar.json",function (data) {
            $('#navbar').bootstrapNavbar({ target :"#tab", data : data ,isTree : false, rootId : 0, parentId : "pid", id : "id", name : "title" , children : "children",onClick : function (data) {
                  this.load(data.url);
            }});
        });
    });
</script>


<body>
    <nav id="navbar"></nav>

    <div id="tab" class="static-tab"></div>
</body>
</html>